<template>
	<div>
		<el-card class="box-card" style="margin-top:15px">
			<div slot="header" class="clearfix">
				<span style="font-weight: bold">科室医生要素</span>
			</div>
			<el-row :gutter="15">
				<el-form class="demo-form-inline" label-width="80px">
					<el-col :span="12">
						<el-form-item label="门诊科室" style="width:100%;" class="s_selectbox">
							<el-input v-model="mzVal" :readonly="true" size="mini" style="width:230px;"></el-input>
							<input type="hidden" v-model="submit.ksdm_mz">
							<el-button type="primary" size="mini" @click="openSelect('门诊科室',submit.ksdm_mz)">选择</el-button>
							<el-button type="primary" size="mini" @click="clearFun('门诊科室')">清除</el-button>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="急诊科室" style="width:100%;" class="s_selectbox">
							<div class="dialogFirstRow2">
								<el-input v-model="jzksVal" :readonly="true" size="mini" style="width:230px;"></el-input>
								<input type="hidden" v-model="submit.ksdm_jz">
								<el-button type="primary" size="mini" @click="openSelect('急诊科室',submit.ksdm_jz)">选择</el-button>
								<el-button type="primary" size="mini" @click="clearFun('急诊科室')">清除</el-button>
							</div>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="住院科室" style="width:100%;" class="s_selectbox">
							<div class="dialogFirstRow2">
								<el-input v-model="zyksVal" :readonly="true" size="mini" style="width:230px;"></el-input>
								<input type="hidden" v-model="submit.ksdm_zy">
								<el-button type="primary" size="mini" @click="openSelect('住院科室',submit.ksdm_zy)">选择</el-button>
								<el-button type="primary" size="mini" @click="clearFun('住院科室')">清除</el-button>
							</div>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="医生选择" style="width:100%;" class="s_selectbox">
							<div class="dialogFirstRow2">
								<el-input v-model="ysxzVal" :readonly="true" size="mini" style="width:230px;"></el-input>
								<input type="hidden" v-model="submit.ysdm">
								<el-button type="primary" size="mini" @click="openSelect('医生',submit.ysdm)">选择</el-button>
								<el-button type="primary" size="mini" @click="clearFun('医生')">清除</el-button>
							</div>
						</el-form-item>
					</el-col>
				</el-form>
			</el-row>
		</el-card>
	</div>
</template>

<script>
	export default {
		name:"KsysysCard",
		data () {
			return {
				mzVal:"",//门诊value
				zyksVal:"",//住院科室value
				ysxzVal:"",//医生选择value
				jzksVal:"",//急诊科室
				submit:{
					ksdm_mz:"",
					ksdm_jz:"",
					ksdm_zy:"",
					ysdm:""
				}
			}
		},
		props:{
			mzksData:{
				type:Object
			},
			jzksData:{
				type:Object
			},
			zyksData:{
				type:Object
			},
			ysData:{
				type:Object
			},
		},
		watch:{
			mzksData(val){
				this.mzVal=val.name;
				this.submit.ksdm_mz=val.id
			},
			jzksData(val){
				this.jzksVal=val.name;
				this.submit.ksdm_jz=val.id
			},
			zyksData(val){
				this.zyksVal=val.name;
				this.submit.ksdm_zy=val.id
			},
			ysData(val){
				this.ysxzVal=val.name;
				this.submit.ysdm=val.id
			}
		},
		methods:{
			openSelect (type,checkId) {
				this.$emit("selectPop",type,checkId);
			},
			clearFun(type){
				switch (type){
					case '门诊科室':
						this.mzVal="";
						this.submit.ksdm_mz="";
						break;
					case '急诊科室':
						this.jzksVal="";
						this.submit.ksdm_jz="";
						break;
					case '住院科室':
						this.zyksVal="";
						this.submit.ksdm_zy="";
						break;
					case '医生':
						this.ysxzVal="";
						this.submit.ysdm="";
						break;
				}
			},
			resetFun(){
				this.mzVal="";
				this.zyksVal="";
				this.ysxzVal="";
				this.jzksVal="";
				this.submit={
					ksdm_mz:"",
					ksdm_jz:"",
					ksdm_zy:"",
					ysdm:""
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.el-card {
		margin-left: 3px;
	}
	.dialogFirstRow>>>.el-input {
		width: 70px;
		margin-right: 10px;
	}
	
	.el-form-item.s_selectbox>>>.el-form-item__content {
		width: 80%;
	}
	
	
	.demo-form-inline>>>.el-form-item {
		margin-bottom: 0px;
	}
	
	.dialogFirstRow>>>label {
		height:41px;
		display:inline-block;
	}
</style>
